<%@ Page Language="C#" Inherits="My.Blog.Web.YaDesignBasePage" AutoEventWireup="false" %>
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>YaDesign</title>
<style type="text/css">
    @import "../_Css/layout.css";
    @import "../_Widget/datepicker/ui.datepicker.css";
    
    #faces img{ cursor:pointer;}
    .cur { border:1px solid #000; border-bottom:3px solid #eee;}
    .cur1{ border:1px solid #000; border-bottom:3px solid #eee;}
</style>
<!--[if lte IE 6]>
    <link href="../_Css/ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->
    <script type="text/javascript" src="../_Resources/Js/jquery.pack.js"></script>
    <script type="text/javascript" src="../_Resources/Js/jquery.plugins.js"></script>
    <script type="text/javascript" src="../_Widget/datepicker/ui.datepicker.js"></script>
</head>
<body>
<div>
    <%Server.Execute("../_Pages/_Header.aspx"); %>
</div>

<div id="header">
    <%Server.Execute("../_Pages/_HeaderPrivate.aspx");%>
</div>

<div id="breadcrumb">
    <%Server.Execute("../_Pages/Breadcrumb.aspx");%>
</div>

<div id="wrapper">
  <!--main-->
  <div id="main">
    <h1>留言板升级中,暂停服务...</h1>
    <%--<div id="comments" class="content">
      <div id="blog_comments_template"><!--在这里加载评论内容--></div>
      <!--<div class="green-black"><span class="disabled"> <  Prev</span><span class="current">1</span><a href="#?page=2">2</a><a href="#?page=3">3</a><a href="#?page=4">4</a><a href="#?page=2">Next  > </a></div>-->

      <div id="send">
        <form method="post" action="/f.aspx?cmd=gsb/art/add" id="frm_comment">
          <input type="hidden" name="catId" value="1" />
        <fieldset>
          <legend>发表留言</legend>
          <p><label for="name">昵　称：</label><input type="text" name="author" id="name" /></p>
          <!--<p><label for="password">标　题：</label><input type="text" name="title" /></p>-->
          <p id="faces"><label for="name">头　像：</label>
              <input type="hidden" id="face" name="face" value="img/face/face1.gif"/>
              <img src="img/face/face1.gif" alt="" />
              <img src="img/face/face2.gif" alt="" />
              <img src="img/face/face3.gif" alt="" />
              <img src="img/face/face4.gif" alt="" />
              <img src="img/face/face5.gif" alt="" />
              <img src="img/face/face6.gif" alt="" />
              <img src="img/face/face7.gif" alt="" />
          </p>
          <script type="text/javascript">
              var faces = $("#faces img");
              faces.hover(function(){
                  $(this).addClass("cur");
              },function(){
                  $(this).removeClass("cur");
              }).click(function(){
                  $("#face").val(this.src);
                  faces.removeClass("cur1");
                  $(this).addClass("cur1");
              });
          </script>

          <p><label>内　容：</label><textarea name="content"></textarea></p>
          <p><label for="validate">验证码：</label>
             <input type="text" name="MyValidateCode" />
             <img id="valiImg" src="../images/ValidateCode.aspx" style="vertical-align:-0.8em;*vertical-align:-0.5em;border:none" />
             <a href="javascript:document.getElementById('valiImg').src='../images/ValidateCode.aspx?'+new Date;void(0);">刷新</a>
          </p>
          <p class="center"><input type="submit" value="发表留言" id="btn" /><input type="button" value="重　置" id="btn" /></p>
        </fieldset>

        </form>
      </div>
    </div>--%>
  </div>
  <!--//main-->
  <!--side-->
  <div id="side">
    <div style="text-align:center;margin-top:10px">
        <!--!#include file="ad/google_200X200_pic.aspx"-->
    </div>
    <div id="linkList">
      <div class="lselect">
        <h3>Categories</h3>
        <div><% Server.Execute("../_Pages/CreateCategory.aspx"); %></div>
        <div><% Server.Execute("../_Pages/CategoryList.aspx"); %></div>
      </div>
      <div class="lselect">
        <h3>Calendar</h3>
        <!--日历-->
        <span id="calendar"></span>
        <div style="clear:both;height:1em"></div>
        <!--//日历-->
      </div>
      <div class="lselect">
        <h3>Message</h3>
        <asp:literal runat="server" id="lblRelationArticles"></asp:literal>
      </div>
      <div class="lselect">
        <h3>Recent Comments</h3>
        <asp:literal runat="server" id="lblRecentComments"></asp:literal>
      </div>
    </div>
    <div style="text-align:center;margin-top:10px">
        <!--!#include file="ad/google_200X200_txt.aspx"-->
    </div>
  </div>
  <!--//side-->
</div>
<div id="footer"><p>© 2008 Design</p></div>



<script type="text/javascript">
    $(function(){

        // 日历
        $('#calendar').attachDatepicker({
          onSelect: function(date) {
            alert(date);
          }
        });

        var comment = new Comments();
    });

    function Comments()
    {
        // 载入框架
        this.topPage = $("#comments");
        this.page = $("#blog_comments_template");

        // 监听显示
        this.list();
        // 监听提交
        this.submit_comment( $("#frm_comment") );

    }

    Comments.prototype.list = function()
    {
        var a = location.hash.split('/');

        var curPage = a[a.length-1] || 1;
        var id = 1;

        // 读取模板
        //var page   = this.page.clone();
        //page[0].id = this.page[0].id+"_clone";

        // 读取数据
        var _ = this;
        $.getJSON( "/execute.aspx?cmd=gsb/art/listJson&catId="+id+"&page="+curPage+"&pageSize=10", function( json ){
            var s = "";
            if( 'undefined' != typeof json.list.id ){

                for( var i=0; i<json.list.id.length; i++ ){

                    s += '<div class="box" id="blog_comments_template">';
                    s += '  <div class="title">';
                    s += '    <img src="img/icon.gif" class="icon" /><p class="left"> <strong>' + $.htmlEncode(json.list.author[i])+'</strong> <span>['+json.list.createTime[i]+']</span></p>';
                    s += '  </div>';
                    s += '  <div class="rows">';
                    s += '    <p><!--<em class="left"><img src="img/face1.gif" /></em>--><span>'+json.list.content[i]+'</span></p>';
                    s += '  </div>';
                    s += '</div>';
                    //s += '<span>' + (i+1+(json.page.PageSize*(json.page.CurrentPage-1))) + '</span> ';
                }
                s +=  '<div id="ajaxPageNav" class="green-black">' + $.pageNav( json.page.RecordCount, json.page.PageCount, json.page.CurrentPage,"blog/cmt/list/"+id ) +'</div>';

            }else{
                s += '<p>该文章目前还没有评论!</p>';
            }
            _.page.empty().append( $(s) );

            // 监听分页导航
            _.pageNav();

        });
        //this.topPage.prepend( page );
    }

    Comments.prototype.submit_comment = function( frm )
    {

        var _ = this;
        frm.submit( function(){
            //alert($(this).serialize());
            $.ajax({
                async: false,
                cache: false,
                timeout: 20000,
                type: "POST",
                contentType:"application/x-www-form-urlencoded",

                url: $(this).attr("action"),
                data:$(this).serialize(),

                //complete:function(dat){alert(dat);},
                success:function(dat){
                    alert( dat );
                    _.list();
                },
                error: function(dat){ alert(dat + ": Error, 发生了错误");  }
            });
            return false;
        });

    };



    Comments.prototype.pageNav = function()
    {
        _ = this;
        $("#ajaxPageNav a").click(function(ev)
        {
          if( 0 == ev.button || 1 == ev.button )  // 只监听左键, 0是ff的左键,1是ie左键
          {
              var tag = ev.target;
              location.hash = tag.hash;
              _.list();
              return false;
          }
        });
    }

</script>

</body>
</html>
